<template>
	<view v-if="invit_list!=null">
		<view class="h750" style="background-image: linear-gradient(#FD4149,#FF754F,#F8F8F8);">
			<u-navbar :bgColor="bgColor" :autoBack="true"></u-navbar>
			<view class="" style="margin-top: 160rpx;"><image class="auto" style="width: 500rpx;" src="/static/image/invite_text.png" mode="widthFix"></image></view>
			<view class="ml24 mr24 bac_f padding30 mt36 p_re radius16">
				<view class="df">
					<image class="w180 h180 radius12" :src="invit_list.image" mode="aspectFill"></image>
					<view class="ml24 dfd_c jcsb" style="max-width: 438rpx;">
						<view class="fw fz30">{{invit_list.name}}</view>
						<view class="dis_flex ac mt16">
							<view class="dis_f">
								<view class="fz24 fw" style="color: #FE3737;">拼团价</view>
								<view class="fz36 fw ml12" style="color: #FE3737;">¥{{invit_list.price}}</view>
								<view class="fz20 tf10 ml12"><del>原价¥{{invit_list.crossed_price}}</del></view>
							</view>
						</view>
					</view>
				</view>
				<view class="p_ab" style="top: 0; left: 0"><image style="width: 90rpx; height:90rpx" src="/static/image/red_l.png" mode=""></image></view>
				<view class="p_ab tf" style="z-index: 10; font-size: 22rpx;top: 22rpx;left: 0rpx;transform: rotate(-45deg);">{{invit_list.num}}人团</view>
			</view>
		</view>
		<view class="ml24 mr24 pl40 pr40 pb40 radius16 bac_f" style="overflow: hidden;margin-top: -240rpx;">
			<view class="tac fz28 mt40">
				仅剩
				<text class="tf_4537">{{invit_list.num}}</text>
				人，快呼吁小伙伴参加吧!
			</view>
			<view class="mt32">
				<view class="dis_f jc">
					<image class="" style="width: 94rpx;height: 94rpx;" src="/static/image/tianjia.png" mode=""></image>
					<image class="ml30 mr30" style="width: 94rpx;height: 94rpx;" src="/static/image/tianjia.png" mode=""></image>
					<image class="" style="width: 94rpx;height: 94rpx;" src="/static/image/tianjia.png" mode=""></image>
				</view>
			</view>
			<view class="dis_f jc mt32">
				剩余<uni-countdown :show-day="false" :hour="2" :minute="30" :second="0" color="#FD395C" background-color="#FFF0F2" />结束
			</view>
			<view class="h88 radius8 fz32 tf dis_f jc mt60" style="width: 610rpx; background-image: linear-gradient(to right,#FE877F,#FE2E27);">
				邀请好友
			</view>
			<u-gap height="1" bgColor="#E7E7E7" marginTop="24"></u-gap>
			<image class="mt40" style="width: 610rpx;height: 148rpx;" src="/static/image/dai_yaoqing_p.png" mode="aspectFill"></image>
		</view>
		<view class="fz22 tf_999 pl48 pr48 mt30">
			<view class="lh38">
				温馨提示：
			</view>
			<view class="lh38">
				1、玩法：支付开团/参团>邀请参团>人满成团。
			</view>
			<view class="lh38">
				2、拼团有效期内，达成参团人数即为拼团成功，商家安排发货。
			</view>
			<view class="lh38">
				3、拼团有效期内，未达成参团人数即为拼团失败，款项原来返回。
			</view>
		</view>
	</view>
</template>

<script>
	import { groupInvitation } from "@/config/api.js";
export default {
	data() {
		return {
			invit_list:null,
			id:'',
			bgColor: 'rgba(255,255,255,0)'
		};
	},
	onLoad(option) {
		if(option){
			this.id = option.id
		}
		this.getInvitation()
	},
	methods: {
		getInvitation(){
			groupInvitation({id:this.id}).then(res=>{
				console.log(res);
				this.invit_list = res
			})
		}
	}
};
</script>

<style></style>
